<html>
	<head>
		<title>Simple Tree View</title>
<style type="text/css"> 
	@import url(treeview.css) screen;
	body { 
	font-family:Verdana; font-size:10pt; 
	width:100%%; height:100%%;  
	background-color: window window threedface threedface;
	}

	#treeview 
	{
	  overflow:auto; height:75%; 
	  width:50%;	  
	  
	  margin:0;
	  padding:1px;
	}

</style>
	</head>
	<body>
		<ul id="treeview" class="treeview">
			<li state="open"><img class="icon">Item1
				<ul>
					<li>Sub Item1</li>
					<li state="open"><img class="icon">Sub Item2
						<ul>
							<li>Sub Sub Item1</li>
							<li>Sub Sub Item2</li>
						</ul>
					<li>Sub Item3</li>
					<li state="open"><img class="icon">Sub Item4
						<ul>
							<li>Sub Sub Item1</li>
							<li>Sub Sub Item2</li>
						</ul>
				</ul>
			</li>
			<li>Item2 caption</li>
			<li>Item3 caption</li>
			<li state="open"><img class="icon">Item4
				<ul>
					<li style="background-color:red yellow green blue; color:white; text-align:center; font-size:10pt"> 
						<p>Yep, collapsible items can have any content.</p>
						<p>Even input elements like input/text <INPUT type="text" value="hello" style="width:10em;" /><br>
            and input/hslider: <INPUT type="hslider" value="50" style="width:10em;" min="0" max="0" buddy="slider-buddy" />. Later one has this element <span id="slider-buddy" >x</span> as a "buddy".</p>
					</li>
				</ul>
			</li>
		</ul>
	</body>
</html>
